<template>
	<view>
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="backText">{{$t('back')}}</block>
			<block slot="content"><text class="text-black text-bold">考勤记录</text></block>
		</cu-custom>

		<view class="cu-list menu sm-border">
			<view @click="goDetails(DateFormat(item.attdate.time,'1'))" v-for="(item,index) in attendances" class="cu-item" :class="index==0?'margin-top':''">
				<view class="content">
					<text class="text-grey">{{DateFormat(item.attdate.time,'1')}}</text>
					<text class="text-grey padding-left">({{getWeek(item.attdate.day)}})</text>
				</view>
				<text class="text-grey">{{getAttState(item)}}</text>
			</view>
		</view>
		<uni-load-more :status="status" :size="5" :content-text="contentText" />
		<no-more :show="!attendances.length>0" text="没有记录"></no-more>
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	var utils = require('@/common/utils.js');
	export default {
		components: {
			uniLoadMore,
		},
		data() {
			return {
				attendances: [],
				page: 1,
				rows: 20,
				totalpage: 0,
				reload: false, //是否重新加载
				status: 'more',
				contentText: {
					// contentdown: '上拉加载更多',
					contentrefresh: '加载中',
					contentnomore: '到底了'
				}
			}
		},
		onLoad() {
			uni.showLoading({
				title:'加载中'
			})
			this.getData()
		},
		onReachBottom() {
			if (this.status == 'noMore') return
			this.status = 'more'
			this.getData()
		},
		methods: {
			getData() {
				if (!this.reload && this.page > 1) this.status = 'loading';
				uni.request({
					url: this.$constant.BASEURL + this.$constant.GET_ATTENDANCE_RECORD,
					method: "POST",
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					data: {
						perid: getApp().globalData.userid,
						page: this.page,
						rows: this.rows
					},
					success: (res) => {
						// console.log(page)
						let page = res.data.data
						if (page.page * page.rows >= page.total) {
							this.status = 'noMore';
						}
						if (res.data.code == 0) {
							let list = page.results
							this.attendances = this.reload ? list : this.attendances.concat(list)
							this.page++;
							this.reload = false;
							// console.log(list)
						} else {
							uni.showModal({
								content: res.data.message,
								showCancel: false,
								cancelText: this.$t('sure'),
								confirmText: this.$t('cancel')
							})
						}
					},
					complete() {
						uni.hideLoading()
					}
				})
			},
			goDetails(time){
				uni.navigateTo({
					url:`attendance-record-detail?time=${time}`
				})
			},
			getAttState(item) {
				let labelText = ''
				if (item.late > 0) {
					labelText += " 迟到"
				}
				if (item.stime == null && item.absenteeism > 0) {
					labelText += " 旷工"
				}
				if (item.leaveearly > 0) {
					labelText += " 早退"
				}
				return labelText
			},
			DateFormat(timestamp, vminimum, stime) {
				return utils.DateFormat(timestamp, vminimum, stime,this.$_i18n.locale)
			},
			getWeek(week) {
				return utils.getWeek(week)
			}
		}
	}
</script>

<style>

</style>
